<template>
<div>
  <img class='qr-img' :width='qrWidth' v-if='imgData!==""' :src='imgData' alt=''>
</div>
</template>

<script>
import qrcode from 'qrcode'
export default {
  props:{
    content:String,
    qrWidth:{
      type:Number,
      default:80,
    }
  },
  name: 'qrcodeImg',
  data(){
    return {
      imgData:''
    }
  },
  mounted(){
    qrcode.toDataURL(this.content).then(res=>{
      this.imgData =res
    })
  }

}
</script>

<style scoped>
.qr-img:hover{
  transform: scale(3);
  border: 1px solid #000000;
}
</style>